import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Button } from 'antd'
import emitter from '@/Evt.js';
import './css/index.less'
import MyTag  from '@/components/home/tabs'
import ArticleL  from './articleList'

class Content extends Component {
	state = {
        // 标签按钮
        btnStatus: false, //按钮状态
        btnIcon: 'down',
        btnText: '打开标签',

        // 二级标签
        homeTagList:[
            {
                value: '语义化标签',
                in: 0
            },
            {
                value: 'H5新标签',
                in: 1
            },
            {
                value: 'canvas',
                in: 2
            },
            {
                value: 'iframe',
                in: 3
            }
        ]

	}

    // 打开/关闭按钮
	openTips = () => {
        if(this.state.btnStatus){
            this.setState({
                btnStatus: false,
                btnIcon: 'down',
                btnText: '打开标签'
            })
        }else{
            this.setState({
                btnStatus: true,
                btnIcon: 'up',
                btnText: '关闭标签'
            })
        }
	}

    
    // 获取顶部选中的tab
    componentDidMount () { 
        //在组件挂载完成后声明一个自定义事件
        emitter.addListener('getActivedTab', (msg) => {
         
        //   this.setState({
        //     msg: 'Custom1收到消息--'+msg
        //   });
        })
      }
    
      // 获取顶部选中的tab
    componentWillUnmount () { 
        //组件销毁前移除事件监听
        emitter.removeListener('getActivedTab', (msg) => {
         
        })
    }

	render() {
		return (
			<div className="content-area">
                <Button type="primary" className="home-btn-top" icon={this.state.btnIcon} onClick={this.openTips}>{this.state.btnText}</Button>
                {/* 二级标签 */}
                <div className='home-tag-area'>
                    <MyTag homeTagList={this.state.homeTagList}></MyTag>
                </div>
                {/* 文章列表 */}
                <ArticleL></ArticleL>
                
			</div>
		)
	}
}

export default Content
